import ProfileMgr from "../../data/ProfileMgr.js";
import $ from "jquery";
class Cart {
    constructor(){
        this.init.call(this);
    }
    init(){
        this.m_cartList = [];
        this.m_timer = null;            // 增加购物车时显示的延时器
        this.m_cartsCbs = $.Callbacks();
        this.bindEvent();
    }
    getStorage(){
        ProfileMgr.repeatLoad(); 
        this.m_cartList = ProfileMgr.getCartList();
    }
    bindEvent(){
        let that = this;
        this.m_cartsCbs.add([$.proxy(this.getStorage,this), 
                            $.proxy(this.renderGoodsList,this)]);
        
        // 滚动事件
        function scrollEvent(){
            var a = $(this).scrollTop();
            if (a >= 50) {
                $(".shopcart_an").css("display", "block")
            } else {
                $(".shopcart_an").css("display", "none")
            }
        }
        $(window).scroll(scrollEvent);
        scrollEvent.call(window);
        // 右侧购物车
        $(".shopcart_an").hover(function () {
            $(".shopcart_nr").hide();
            if ($(".shopcart_nr1").css("display") == "block") {
                return
            }
            that.showCartUI(".shopcart_an .shopcart_nr1");
            $(".shopcart_nr1").show();
        }, function () {
            $(".shopcart_nr1").hide()
        });
        // 头部购物车
        $(".web_head .shopcart").hover(function () {
            $(".shopcart_nr1").hide();
            if ($(".shopcart_nr").css("display") == "block") {
                return
            }
            $(".shopcart_nr").show();
            that.showCartUI(".shopcart .shopcart_nr");
        }, function () {
            $(".shopcart_nr").hide()
        });
        // 删除购物车商品
        $(".shopcart_an .goon_buy").on("click",".delrcart",function(){
            that.removeCart(".shopcart_an .shopcart_nr1", $(this).data("goodsid"));
        });
        $(".shopcart .goon_buy").on("click",".delrcart",function(){
            that.removeCart(".shopcart .shopcart_nr", $(this).data("goodsid"));
        });
        $(".cartgoodsnum").html(ProfileMgr.getCartCount());
    }
    renderGoodsList(selector){
         // 购物车中有商品
         let totalPrice = 0,
            totalCount = 0,
            html = ``;
        if(this.m_cartList.length <= 0){
            html += `<li class="nobuys">购物车中还没有商品，赶紧选购吧！</li>`;
        }
        else{
            this.m_cartList.forEach((info,index)=>{
                // 单价
                let unitPrice = parseInt(info.normal_price);
                let total = unitPrice * info.count;
                totalPrice += total;
                totalCount += info.count;
                if(index > 4) return true;
                html += `<li id="shopcartid${info.goods_id}">
                    <div class="cart_lt">
                        <a href="${info.link_url}" target="_blank">
                            <img width="60px" height="98px" src="${info.img}">
                        </a>
                    </div>
                    <div class="cart_rt">
                        <p class="biaoti">
                            <a href="${info.link_url}" target="_blank">${info.goods_name}</a>
                        </p>
                        <p class="money_cart">
                            ￥${unitPrice.toFixed(2)}
                            <em>×${info.count}</em>
                        </p>
                        <p class="js_cart">
                            <b>￥${total.toFixed(2)}</b>
                        </p>
                    </div>
                    <div class="guanb">
                        <a href="javascript:void(0)" data-goodsid="${info.goods_id}"
                            id="removecart${info.goods_id}" title="从购物车中移除${info.goods_name}" class="delrcart">
                        </a>
                    </div>
                    <div class="both">
                    </div>
                </li>`;
            });

            // 总计
            html += `<li class="no_bottom">
                <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr>
                            <td>
                                <a>共<b id="tatolQu">${totalCount}</b>件商品</a>
                            </td>
                            <td rowspan="2">
                                <a class="qu_jieuan" href="###">
                                    去结算
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <a class="gong">
                                    共计:<b id="tatolPric">￥${totalPrice.toFixed(2)}</b></a>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </li>`;
        }

        $(selector).find(".goon_buy").html(html);
        // 同步购物车商品数量
        ProfileMgr.setCartCount(totalCount);
        $(".cartgoodsnum").html(totalCount);
    }
    removeCart(selector,goodsId){
        ProfileMgr.removeCartListById(goodsId,true);
        this.m_cartsCbs.fire(selector);
    }
    showCartUI(selector){
        this.m_cartsCbs.fire(selector);
    }
    // 增加购物车
    addCart(){
        if(this.m_timer){
            clearTimeout(this.m_timer);
        }
        let f;
        if ($(".shopcart_an").is(":visible")) {
            $(".shopcart_nr").hide();
            $(".shopcart_nr1").show();
            this.m_timer = setTimeout(()=>{
                $(".shopcart_nr1").hide();
            }, 3000);
            f = ".shopcart_an .shopcart_nr1"
        } else {
            $(".shopcart_nr1").hide();
            $(".shopcart_nr").show();
            this.m_timer = setTimeout(()=>{
                $(".shopcart_nr").hide();
            }, 3000);
            f = ".shopcart .shopcart_nr"
        }
        this.showCartUI(f);
    }
}

module.exports = Cart;